<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript">
	$(function() {
		$('#container').highcharts({
			chart : {
				type : 'spline'
			},
			title : {
				text : 'Monthly Average Temperature'
			},
			subtitle : {
				text : 'Source: WorldClimate.com'
			},
			xAxis : {
				categories : [ 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec' ]
			},
			yAxis : {
				title : {
					text : 'Temperature'
				},
				labels : {
					formatter : function() {
						return this.value + '°'
					}
				}
			},
			tooltip : {
				crosshairs : true,
				shared : true
			},
			plotOptions : {
				spline : {
					marker : {
						radius : 4,
						lineColor : '#666666',
						lineWidth : 1
					}
				}
			},
			series : [ {
				name : 'Tokyo',
				marker : {
					symbol : 'square'
				},
				data : [ 7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
					y : 26.5,
					marker : {
						symbol : 'url(http://www.highcharts.com/demo/gfx/sun.png)'
					}
				}, 23.3, 18.3, 13.9, 9.6 ]

			}, {
				name : 'London',
				marker : {
					symbol : 'diamond'
				},
				data : [ {
					y : 3.9,
					marker : {
						symbol : 'url(http://www.highcharts.com/demo/gfx/snow.png)'
					}
				}, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8 ]
			} ]
		});
	});
</script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>
